/**
 * Created with JetBrains PhpStorm.
 * User: vander
 * Date: 5/9/13
 * Time: 9:58 PM
 * To change this template use File | Settings | File Templates.
 */
var MyPage = Class.create({
    initialize: function(book, o){
        var _this = this;

        this.book = book;
        //o : jsonObject
        this.data = o;
        this.id = o.id
        this.elements = new Array();

        this.pageTag = new Element("div",{id:this.id});
        $j(this.pageTag).attr({"data-role" : "page"}).on("touchmove", function(e){e.preventDefault();});

        this.divTag = new Element("div", {class: "page-view"});
        $j(this.divTag).attr({"data-role": "content"}).appendTo(this.pageTag);

        //Thanh phan menu nam tren tung trang
        this.menuBtn = $j('<a href="#popupMenu'+ o.id+'" data-rel="popup" data-role="button" data-inline="true" data-icon="home" data-iconpos="notext">Actions...</a>')
            .addClass("menuBtn");
        //Popup xuat hien khi click vao menu
        this.popup = $j('<div data-role="popup" id="popupMenu'+ o.id +'" data-theme="d">'
                        + '<ul data-role="listview" data-inset="true" style="min-width:210px;" data-theme="d">'
                            + '<li><a href="#collection">Back to Collection</a></li>'
                            + '<li class="add-bookmark"><a >Add Bookmark</a></li>'
                        + '</ul>'
                        + '</div>');

        //Add bookmark option
        $j(this.popup).find("li.add-bookmark").off("tap").on("tap", function(){
            // Add bookmark
            Global.bookmark.add({
                bookId: _this.book.id,
                pageId: _this.id,
                bookName: _this.book.name,
                coverImage: _this.getResourcesPath() + _this.book.coverImage
            });

            //Close popup
            $j(_this.popup).popup("close");
        });

        $j(this.divTag).append(this.menuBtn);
        $j(this.pageTag).append(this.popup);

        //Khoi tao cac doi tuong tren page

        $j.each(this.data.elements, function(){
            _this.elements.push(new MyElement(_this, this.element));
        });

        $j(this.pageTag).trigger("pagecreate");
    },
    getResourcesPath: function(){
        return this.book.resourcesPath;
    },
    attach: function(){
        $j("body").append(this.pageTag);
    },
    detach: function(){
        $j(this.pageTag).detach();
    }
});